<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.w3.org/1999/xhtml">

<head>
    <th:block th:include="common/common_head :: commonHeader('数据字典')"/>
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-condition">
            <form id="dict-form">
                <div class="select-list">
                    <ul>
                        <li class="col-sm-3">
                            <label>字典类别：</label>
                            <select name="dictType" id="dictTypeDom" style="width: 60%">
                            	<option value=""></option>
                            </select>
                        </li>
                        <li class="col-sm-3">
                            <label style="width:120px">字典名称/字典值： </label>
                            <input type="text" name="dictVal" id="dictValDom" style="width: 60%" placeholder="字典名称/字典值" />
                        </li>
                        <li class="col-sm-3">
                            <button type="button" class="btn btn-primary btn-rounded btn-sm" onclick="queryTable()"><i class="fa fa-search"></i>&nbsp;搜索</button>
                            <button class="btn btn-warning btn-rounded btn-sm" type="reset"><i class="fa fa-eraser"></i>&nbsp;重置</button>
                        </li>
                    </ul>
                </div>
            </form>
        </div>

        <div class="col-sm-12 select-info order-table">
            <div class="btn-group hidden-xs toolbar" id="toolbar" role="group">
                <a class="btn btn-outline btn-success btn-rounded" onclick="toAdd()" shiro:hasPermission="sys:dict:save">
                    <i class="fa fa-plus"></i> 新增
                </a>
                <a class="btn btn-outline btn-success btn-rounded" onclick="reloadTable()">
                    <i class="fa fa-refresh"></i> 刷新
                </a>
                <a class="btn btn-outline btn-danger btn-rounded" onclick="flushCache()">
                    <i class="fa fa-gear"></i> 更新缓存
                </a>
            </div>
            <table id="dictTreeTable" data-mobile-responsive="true"></table>
        </div>
    </div>
</div>
<!--引入公共js-->
<div th:include="common/onload_js :: onloadJS"></div>
<script th:inline="javascript">
	$(function() {
		TREE_GRID.init("dictTreeTable", {
            url: ctxPath+"/sys/dict/list",
            onLoadSuccess: function(data) {initTypeSel($("#dictTypeDom"));},
            onResetView: function() {initSwitch();},
            uniqueId: "id", //每一行的唯一标识，一般为主键列
            treeId: "id",//定义关键字段来标识树节点
            treeField: "txt",//定义树节点字段
            treeParentId: "typeId", //定义父级ID字段
            treeRootLevel: 0,//根节点序号
            columns: [
    	                {
    	                    field: 'id',
    	                    visible: false
    	                },{
    	                    field:'txt',
    	                    title:'字典文本'
    	                },{
    	                    field:'val',
    	                    title:'字典值'
    	                },{
    	                    field:'remark',
    	                    title:'备注'
    	                },{
    	                    field:'status',
    	                    title:'状态',
    	                    formatter: function (value, row, index) {
    	                        if (row.typeOrItem == 0) {
    	                            return "";
    	                        }
    	                    	if(value == 1) {
    	                    		return '<input type="checkbox" checked class="make-switch" data-on-text="启用" data-off-text="禁用" dataId='+row['id']+' />';
    	                    	}
    	                    	return '<input type="checkbox" class="make-switch" data-on-text="启用" data-off-text="禁用" dataId='+row['id']+' />';
    	                    }
    	                }, {
    	                    title: '操作',
    	                    formatter: function (value, row, index) {
    	                        if (row.typeOrItem == 0) {
    	                            //return "";
    	                        }
    	                        var step = "    ";
    	                        var edit = "<button type='button' class='btn btn-success btn-xs "+ editFlag +"' onclick='toEdit( " + row.id +
    	                            ")'><i class='fa fa-edit'>编辑</i> </button>";
    	                        var del = "<button type='button' class='btn btn-danger btn-xs "+ delFlag +"' onclick='deleteData( " + row.id + ", " + row.typeOrItem +
    	                            ")'><i class='fa fa-remove'>删除</i> </button>";
    	                        return edit + step + del;
    	                    }
    	                }
    	            ]
        });
	});
	
	function initSwitch() {
	    $('.make-switch').bootstrapSwitch();
	    $('.make-switch').on('switchChange.bootstrapSwitch', function(e, data) {
	    	var dataId = $(this).attr('dataId');
	    	var status = data ? 1 : 0;
	        Page.ajaxPOST(ctxPath + '/sys/dict/changeStatus', {id: dataId, status: status}, function(o) {},{loadingMsg:"正在提交数据，请稍候……"});
	    });
	    return true;
	}
	
    var editFlag = [[${@permission.hasPermi('sys:dict:update')}]];
    var delFlag = [[${@permission.hasPermi('sys:dict:delete')}]];
    
    function reloadTable() {
        TREE_GRID.refresh('dict-form');
    }
    
    function queryTable() {
    	TREE_GRID.search('dict-form');
    }
    
    function flushCache() {
    	Page.ajaxPOST(ctxPath + '/sys/dict/flushCache', {}, function(o) {
    		Dialog.msg("更新成功!", function() {
    			reloadTable();
    			var dictTypeDom = $("#dictTypeDom");
    			dictTypeDom.empty();
    			dictTypeDom.append("<option value=''></option>");
    			initTypeSel(dictTypeDom);
    			$("#dictValDom").val("");
    		});
    		},{loadingMsg:"正在从服务器上获取最新数据，请稍候……"});
    }
    
    function formatter(value,option) {
        var formatter = "";
        if (value != undefined) {
            if ( option != undefined) {
                if (option[value] != undefined) {
                    formatter = option[value]
                }
            } else{
                formatter = value
            }
        }
        return formatter;
    }

    // 新增
    function toAdd(){
    	var dictType = $("#dictTypeDom").val();
    	var url = dictType == "" ? '/modules/sys/dict/dict_add.html' : '/sys/dict/toAdd/'+dictType;
        Dialog.openUrl('添加字典配置', ctxPath+url, {
            area : ['770px' , '405px']
        });
    }

    /**
     * 编辑
     */
    function toEdit(id) {
        Dialog.openUrl('修改字典配置', ctxPath+'/sys/dict/toEdit/'+id, {
            area : ['770px' , '405px']
        });
    }

    /**
     * 删除
     **/
    function deleteData(id, typeOrItem) {
    	var confirmMsg = (typeOrItem == 0) ? "删除类别将会同时删除类别下的所有条目！<br>请务必谨慎操作！是否确定全部删除？" : "确认要删除这个条目？"
        Dialog.confirm(confirmMsg, function () {
            Page.ajaxPOST(ctxPath + "/sys/dict/delete/"+id, null, function (data) {
                //刷新列表
                Dialog.msg("操作成功", function () {
                    reloadTable();
                });
            });
        });
    }
</script>

</body>
</html>
